<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"/>
	<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1"/>
	<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
	<meta name="renderer" content="webkit"/>
	<title>键帽返修</title>			
    <link type="text/css" rel="stylesheet" href="css/style.css"/>
	<script type="text/javascript" src="js/jquery.min.js"></script>
</head>
<body>
	<article>
		<header>
			<h1>键帽返修</h1>
			<ul class="btn-group">
				<li class="btn">配置</li>
				<!--通过切换class:on展开收起-->
				<li class="btn btn-drop-down">
					<span>仓位选择</span>
					<ul>
						<li class="active">仓位选择</li>
						<li>选项1</li>
						<li>选项2</li>
						<li>选项3</li>
						<li>选项4</li>
					</ul>
				</li>
				<li class="btn">移动tray盘位置</li>
				<li class="btn">上料</li>
				<li class="btn">打开调试界面</li>
				<li class="btn">gototray</li>
				<li class="btn">扫描全部</li>
				<li class="btn">扫描</li>
				<li class="btn">downAo sds</li>
				<li class="btn">确认</li>
				<li class="btn btn-connect active">已连接</li>
				<li class="btn btn-cross active">已过站</li>
			</ul>
		</header>
		<section>
			<div class="aside">
				<div>
					<ul>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress progress-warning" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li class="active"><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
					</ul>
					<ul>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
					</ul>
					<ul>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
					</ul>
				</div>
				<div>
					<ul>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
					</ul>
					<ul>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
					</ul>
					<ul>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
						<li><span class="language">Japan</span><div class="progress" ><div class="value" style="width: 60%;"></div></div><span class="color">crimson</span><span class="remain-number">188</span></li>
					</ul>
				</div>
			</div>
			<div class="main">
				<div class="chart-container">
					<div class="keyboard-repair-total">
						<div class="chart">50</div>
						<h2>当前键盘返修总数</h2>
					</div>
					<div class="tray-total">
						<div class="chart">20</div>
						<h2>当前Tray盘总数</h2>
					</div>
					<div class="period">
						<div class="chart"></div>
						<h2>周期时间</h2>
					</div>
					<div class="language">
						<div class="chart"></div>
						<h2>总语言量</h2>
					</div>
					<div class="tray-remain">
						<div class="chart"></div>
						<h2>Tray盘剩余量</h2>
					</div>
					<div class="keycap-remain">
						<div class="chart"></div>
						<h2>键帽剩余量</h2>
					</div>
				</div>
				<div class="keyboard-container">
					<div class="top">
						<div class="keyboard-barcode">
							<div class="header">
								<!--模式切换-->
								<div class="tabs tabs-mode">
									<a class="active" href="javascript:;">自动</a>
									<a href="javascript:;">手动</a>
									<a href="javascript:;">测试</a>
								</div>
								<!--<div class="switch"><input type="checkbox" name="switch-input" id="switch-input"/><label for="switch-input">开启手动模式</label></div>-->
								<!--键盘种类切换-->
								<div class="tabs tabs-keyboard">
									<a class="active" href="javascript:;">ANSI</a>
									<a href="javascript:;">ISO</a>
									<a href="javascript:;">JIS</a>
								</div>
								<!--语言选择-->
								<select name="lang" id="">
									<option value="0">International</option>
									<option value="1">Chinese</option>
									<option value="2">English</option>
									<option value="3">Spanish</option>
								</select>
								<!--颜色选择选择-->
								<select name="color" id="">
									<option value="0">黑色</option>
									<option value="1">白色</option>
									<option value="2">蓝色</option>
									<option value="3">yellowgreen</option>
								</select>
							</div>
							<div class="body">
								<input class="auto" type="text" name="" placeholder="自动扫描键盘条码" readonly="readonly"/>
								<input class="manual" type="text" name="" placeholder="手动输入键盘条码"/>
								<button type="button">提取</button>
							</div>
						</div>
						<div class="lost-keycap-info">
							<h2>缺失键帽信息</h2>
							<div>
								<ul>
									<li>
										<div><span>Tab</span><span>Spanish 蓝色</span></div>
										<div><span>248</span><span>剩余键帽</span></div>
										<div><span>48</span><span>剩余Tray盘</span></div>
									</li>
									<li>
										<div><span>command</span><span>International 蓝色</span></div>
										<div><span>248</span><span>剩余键帽</span></div>
										<div><span>48</span><span>剩余Tray盘</span></div>
									</li>
									<li>
										<div><span>space</span><span>Spanish 蓝色</span></div>
										<div><span>248</span><span>剩余键帽</span></div>
										<div><span>48</span><span>剩余Tray盘</span></div>
									</li>
								</ul>
							</div>
						</div>
					</div>
					<div class="bottom">
						<ul class="keyboard keyboard-ansic">
							<li class=" first-line esc active">
								<div>
									<span>esc</span>
									<span>1</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F1</span>
									<span>0</span>
								</div>
							</li>
							<li class="first-line">
								<div>

									<span>F2</span>
									<span>2</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F3</span>
									<span> 3</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F3</span>
									<span> 4</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F5</span>
									<span> 5</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F6</span>
									<span> 6</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F7</span>
									<span>2</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F8</span>
									<span>1</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F9</span>
									<span>3</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F10</span>
									<span> 0</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F11</span>
									<span>11</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F12</span>
									<span> 12</span>
								</div>
							</li>
							<li class="clear-margin first-line ">
								<div>
									<span class="icon icon-on"></span>
									<span>12</span>
								</div>
							</li>
							<li >
								<div>
									<span>1</span>
									<span>~</span>
								</div>

							</li>
							<li >
								<div>
									<span>1</span>
									<span>1</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>2</span>
								</div>
							</li>
							<li >
								<div>
									<span>3</span>
									<span>3</span>
								</div>
							</li>
							<li >
								<div>
									<span>4</span>
									<span>4</span>
								</div>
							</li>
							<li >
								<div>
									<span>5</span>
									<span>5</span>
								</div>
							</li>
							<li >
								<div>
									<span>6</span>
									<span>6</span>
								</div>
							</li>
							<li >
								<div>
									<span>7</span>
									<span>7</span>
								</div>
							</li>
							<li >
								<div>
									<span>8</span>
									<span>8</span>
								</div>
							</li>
							<li >
								<div>
									<span>9</span>
									<span>9</span>
								</div>
							</li>
							<li >
								<div>
									<span>0</span>
									<span>0</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>-</span>
								</div>
							</li>
							<li >
								<div>
									<span>0</span>
									<span>+</span>
								</div>
							</li>
							<li class="clear-margin  esc">
								<div>
									<span>0</span>
									<span>delete</span>
								</div>

							</li>

							<li  class="esc">
								<div class="empty">
									<span>2</span>
									<span>tab</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>Q</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>W</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>E</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>R</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>T</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>Y</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>U</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>I</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>O</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>P</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>[</span>
								</div>
							</li>
							<li >
								<div>
									<span>0</span>
									<span>]</span>
								</div>

							</li>
							<li class="clear-margin ">
								<div>
									<span>0</span>
									<span>|</span>
								</div>


							</li>

							<li class="enter">
								<div>
									<span>0</span>
									<span>中/英</span>
								</div>

							</li>
							<li >
								<div>
									<span>2</span>
									<span>A</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>S</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>D</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>F</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>G</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>H</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>J</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>K</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>L</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>;</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>'</span>
								</div>
							</li>
							<li class="clear-margin enter">
								<div>
									<span>2</span>
									<span>return</span>
								</div>
							</li>

							<li class="shift">
								<div>
									<span>0</span>
									<span>shift</span>
								</div>
							</li>

							<li >
								<div>
									<span>2</span>
									<span>Z</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>X</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>C</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>V</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>B</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>N</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>M</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span><</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span> > </span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>/</span>
								</div>
							</li>
							<li class="clear-margin shift">
								<div>
									<span>0</span>
									<span>shift</span>
								</div>
							</li>

							<li >
								<div>
									<span>2</span>
									<span>fn</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>control</span>
								</div>
							</li>
							<li >
								<div>
									<span>0</span>
									<span>option</span>
								</div>
							</li>
							<li class="command">
								<div class="empty">
									<span>0</span>
									<span>command</span>
								</div>
							</li>
							<li class="space">
								<div class="empty">
									<span>0</span>
									<span>space</span>
								</div>
							</li>
							<li class="command">
								<div>
									<span>0</span>
									<span>command</span>
								</div>
							</li>
							<li >
								<div>
									<span>0</span>
									<span>option</span>
								</div>
							</li>

							<!--方向键-->

							<li>
								<div>
									<span>0</span>
									<span class="icon icon-left"></span>
								</div>
							</li>
							<ol  class="arrow">
								<li>
									<div class="arrow-up">
										<span class="icon icon-up"></span>
										<span>0</span>
									</div>
								</li>
								<li>
									<div class="arrow-down">
										<span class="icon icon-down"></span>
										<span>0</span>
									</div>
								</li>
							</ol>

							<li class="clear-margin">
								<div>
									<span>0</span>
									<span class="icon icon-right"></span>
								</div>
							</li>
						</ul>
						<ul class="keyboard keyboard-iso" style="display: none">
							<li class=" first-line esc">
								<div>
									<span>esc</span>
									<span>1</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F1</span>
									<span></span>
								</div>
							</li>
							<li class="first-line">
								<div>

									<span>F2</span>
									<span>2</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F3</span>
									<span> 3</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F3</span>
									<span> 4</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F5</span>
									<span> 5</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F6</span>
									<span> 6</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F7</span>
									<span>2</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F8</span>
									<span>1</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F9</span>
									<span>3</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F10</span>
									<span> 0</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F11</span>
									<span>11</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F12</span>
									<span> 12</span>
								</div>

							</li>
							<li class="clear-margin first-line ">
								<div>
									<span class="icon icon-on"></span>
									<span>12</span>
								</div>
							</li>


							<li >
								<div>
									<span>1</span>
									<span>。</span>
								</div>

							</li>
							<li >
								<div>
									<span>2</span>
									<span>1</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>2</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>3</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>4</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>5</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>6</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>7</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>8</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>9</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>0</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>、</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>_</span>
								</div>
							</li>
							<li class="clear-margin esc">
								<div>
									<span>0</span>
									<span>delete</span>
								</div>

							</li>

							<li class="esc">
								<div>
									<span>2</span>
									<span>tab</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>Q</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>W</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>E</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>R</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>T</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>Y</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>U</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>I</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>O</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>P</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>[</span>
								</div>
							</li>
							<li >
								<div>
									<span>0</span>
									<span>]</span>
								</div>

							</li>
							<li class="clear-margin return">
								<div>
									<span>0</span>
									<span>return</span>
								</div>


							</li>

							<li class="enter">
								<div>
									<span>0</span>
									<span>caps lock</span>
								</div>

							</li>
							<li >
								<div>
									<span>2</span>
									<span>A</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>S</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>D</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>F</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>G</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>H</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>J</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>K</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>L</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>;</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>'</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>\</span>
								</div>
							</li>

							<li class="shift1">
								<div>
									<span>0</span>
									<span>shift</span>
								</div>

							</li>
							<li >
								<div>
									<span>2</span>
									<span>~</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>Z</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>X</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>C</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>V</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>B</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>N</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>M</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span><</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>></span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>/</span>
								</div>
							</li>
							<li class="clear-margin shift2">
								<div>
									<span>0</span>
									<span>shift</span>
								</div>
							</li>

							<li >
								<div>
									<span>2</span>
									<span>fn</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>control</span>
								</div>
							</li>
							<li >
								<div>
									<span>0</span>
									<span>option</span>
								</div>

							</li>
							<li class="command">
								<div>
									<span>0</span>
									<span>command</span>
								</div>

							</li>
							<li class="space">
								<div>
									<span>0</span>
									<span>space</span>
								</div>

							</li>
							<li class="command">
								<div>
									<span>0</span>
									<span>command</span>
								</div>

							</li>
							<li >
								<div>
									<span>0</span>
									<span>option</span>
								</div>

							</li>

							<!--方向键-->


							<li>
								<div>
									<span>0</span>
									<span class="icon icon-left"></span>
								</div>


							</li>
							<ol class="arrow">
								<li class="arrow-up">
									<div>
										<span class="icon icon-up"></span>
										<span>0</span>
									</div>

								</li>
								<li class="arrow-down">
									<div>
										<span class="icon icon-down"></span>
										<span>0</span>
									</div>

								</li>

							</ol>

							<li class="clear-margin">
								<div>
									<span>0</span>
									<span class="icon icon-right"></span>
								</div>
							</li>
						</ul>
						<ul class="keyboard keyboard-jis" style="display: none">
							<li class=" first-line">
								<div>
									<span>esc</span>
									<span>1</span>
								</div>
							</li>
							<li class="first-line">
								<div>
									<span>F1</span>
									<span></span>
								</div>
							</li>
							<li class="first-line">
								<div>

									<span>F2</span>
									<span>2</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F3</span>
									<span> 3</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F3</span>
									<span> 4</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F5</span>
									<span> 5</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F6</span>
									<span> 6</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F7</span>
									<span>2</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F8</span>
									<span>1</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F9</span>
									<span>3</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F10</span>
									<span> 0</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F11</span>
									<span>11</span>
								</div>

							</li>
							<li class="first-line">
								<div>
									<span>F12</span>
									<span> 12</span>
								</div>

							</li>
							<li class="clear-margin first-line esc">
								<div>
									<span class="icon icon-on"></span>
									<span>12</span>
								</div>
							</li>


							<li class="esc">
								<div>
									<span>1</span>
									<span>1</span>
								</div>

							</li>
							<li >
								<div>
									<span>2</span>
									<span>2</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>3</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>4</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>5</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>6</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>7</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>8</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>9</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>0</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>=</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>~</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>￥</span>
								</div>
							</li>
							<li class="clear-margin ">
								<div>
									<span>0</span>
									<span>delete</span>
								</div>

							</li>

							<li >
								<div>
									<span>2</span>
									<span>tab</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>Q</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>W</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>E</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>R</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>T</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>Y</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>U</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>I</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>O</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>P</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>、</span>
								</div>
							</li>
							<li >
								<div>
									<span>0</span>
									<span>{</span>
								</div>

							</li>
							<li class="clear-margin return">
								<div>
									<span>0</span>
									<span>return</span>
								</div>


							</li>

							<li class="enter">
								<div>
									<span>0</span>
									<span>control</span>
								</div>

							</li>
							<li >
								<div>
									<span>2</span>
									<span>A</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>S</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>D</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>F</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>G</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>H</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>J</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>K</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>L</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>+</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>*</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>}</span>
								</div>
							</li>

							<li class="shift">
								<div>
									<span>0</span>
									<span>shift</span>
								</div>

							</li>
							<li >
								<div>
									<span>2</span>
									<span>Z</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>X</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>C</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>V</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>B</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>N</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>M</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span><</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>></span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>?</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>口</span>
								</div>
							</li>
							<li class="clear-margin shift">
								<div>
									<span>0</span>
									<span>shift</span>
								</div>
							</li>

							<li >
								<div>
									<span>2</span>
									<span>caps</span>
								</div>
							</li>
							<li >
								<div>
									<span>2</span>
									<span>option</span>
								</div>
							</li>
							<li class="command">
								<div>
									<span>0</span>
									<span>command</span>
								</div>

							</li>
							<li class="command">
								<div>
									<span>0</span>
									<span>英数</span>
								</div>

							</li>
							<li class="space">
								<div>
									<span>0</span>
									<span>space</span>
								</div>

							</li>
							<li class="command">
								<div>
									<span>0</span>
									<span>わわ</span>
								</div>

							</li>
							<li class="command">
								<div>
									<span>0</span>
									<span>conmad</span>
								</div>

							</li>
							<li >
								<div>
									<span>2</span>
									<span>fn</span>
								</div>
							</li>
							<!--方向键-->


							<li>
								<div>
									<span>0</span>
									<span class="icon icon-left"></span>
								</div>


							</li>
							<ol class="arrow">
								<li class="arrow-up">
									<div>
										<span class="icon icon-up"></span>
										<span>0</span>
									</div>

								</li>
								<li class="arrow-down">
									<div>
										<span class="icon icon-down"></span>
										<span>0</span>
									</div>

								</li>

							</ol>

							<li class="clear-margin">
								<div>
									<span>0</span>
									<span class="icon icon-right"></span>
								</div>


							</li>

						</ul>
						<ul class="keyboard-info">
							<li><span class="icon icon-flag"></span>Country :<span>International</span></li>
							<li><span class="icon icon-ruler"></span>Model :<span>X369A</span></li>
							<li><span class="icon icon-config"></span>Config :<span>ISO</span></li>
							<li><span class="icon icon-list"></span>EEEEE :<span>HW6C</span></li>
							<li><span class="icon icon-color"></span>Color :<span>Sparrow</span></li>
						</ul>
					</div>
				</div>
				<div class="table-container">
					<div class="repair-log">
						<h2>键帽返修日志</h2>
						<div>
							<table class="table">
								<thead>
								<tr>
									<th>时间</th>
									<th>动作</th>
								</tr>
								</thead>
								<tbody>
								<tr>
									<td>11:40:50</td>
									<td>元素：启动前条码检测</td>
								</tr>
								<tr>
									<td>11:40:50</td>
									<td>元素：启动前条码检测</td>
								</tr>
								<tr>
									<td>11:40:50</td>
									<td>元素：启动前条码检测</td>
								</tr>
								<tr>
									<td>11:40:50</td>
									<td>元素：启动前条码检测</td>
								</tr>
								<tr>
									<td>11:40:50</td>
									<td>元素：启动前条码检测</td>
								</tr>
								<tr>
									<td>11:40:50</td>
									<td>元素：启动前条码检测</td>
								</tr>
								</tbody>
							</table>
						</div>
					</div>
					<div class="axis-status">
						<h2>轴状态</h2>
						<table class="table">
							<thead>
								<tr>
									<th>轴</th>
									<th>实时状态</th>
									<th>实时速度</th>
									<th>实时位置</th>
								</tr>
							</thead>
							<tbody>
								<tr>
									<td>1</td>
									<td>停止</td>
									<td>0</td>
									<td>1888</td>
								</tr>
								<tr>
									<td>2</td>
									<td>停止</td>
									<td>0</td>
									<td>1888</td>
								</tr>
								<tr>
									<td>3</td>
									<td>停止</td>
									<td>0</td>
									<td>1888</td>
								</tr>
								<tr>
									<td>4</td>
									<td>停止</td>
									<td>0</td>
									<td>1888</td>
								</tr>
								<tr>
									<td>5</td>
									<td>停止</td>
									<td>0</td>
									<td>1888</td>
								</tr>
							</tbody>
						</table>
					</div>
				</div>
			</div>
		</section>
	</article>
	<!--操作提示-->
	<div class="toast">扫描成功</div>
	<!--遮罩层-->
	<div class="mask"></div>
	<!--tray信息弹窗-->
	<aside class="dialog dialog-tray-info">
		<header>
			<table class="table">
				<caption>Tray盘信息</caption>
				<thead>
					<tr>
						<th>Country</th>
						<th>Model</th>
						<th>Config</th>
						<th>EEEE</th>
						<th>Color</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<td>International</td>
						<td>X396A</td>
						<td>ISO</td>
						<td>HW6C</td>
						<td>Sparrow</td>
					</tr>
				</tbody>
			</table>
			<button>提取Tray盘</button>
			<span class="icon icon-close"></span>
		</header>
		<section>
			<ul class="keyboard keyboard-ansic">
				<li class=" first-line esc">
					<div>
						<span>esc</span>
						<span>1</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F1</span>
						<span>0</span>
					</div>
				</li>
				<li class="first-line">
					<div>

						<span>F2</span>
						<span>2</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F3</span>
						<span> 3</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F3</span>
						<span> 4</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F5</span>
						<span> 5</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F6</span>
						<span> 6</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F7</span>
						<span>2</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F8</span>
						<span>1</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F9</span>
						<span>3</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F10</span>
						<span> 0</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F11</span>
						<span>11</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F12</span>
						<span> 12</span>
					</div>
				</li>
				<li class="clear-margin first-line ">
					<div>
						<span class="icon icon-on"></span>
						<span>12</span>
					</div>
				</li>
				<li >
					<div>
						<span>1</span>
						<span>~</span>
					</div>

				</li>
				<li >
					<div>
						<span>1</span>
						<span>1</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>2</span>
					</div>
				</li>
				<li >
					<div>
						<span>3</span>
						<span>3</span>
					</div>
				</li>
				<li >
					<div>
						<span>4</span>
						<span>4</span>
					</div>
				</li>
				<li >
					<div>
						<span>5</span>
						<span>5</span>
					</div>
				</li>
				<li >
					<div>
						<span>6</span>
						<span>6</span>
					</div>
				</li>
				<li >
					<div>
						<span>7</span>
						<span>7</span>
					</div>
				</li>
				<li >
					<div>
						<span>8</span>
						<span>8</span>
					</div>
				</li>
				<li >
					<div>
						<span>9</span>
						<span>9</span>
					</div>
				</li>
				<li >
					<div>
						<span>0</span>
						<span>0</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>-</span>
					</div>
				</li>
				<li >
					<div>
						<span>0</span>
						<span>+</span>
					</div>
				</li>
				<li class="clear-margin  esc">
					<div>
						<span>0</span>
						<span>delete</span>
					</div>

				</li>

				<li  class="esc">
					<div class="empty">
						<span>2</span>
						<span>tab</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>Q</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>W</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>E</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>R</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>T</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>Y</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>U</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>I</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>O</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>P</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>[</span>
					</div>
				</li>
				<li >
					<div>
						<span>0</span>
						<span>]</span>
					</div>

				</li>
				<li class="clear-margin ">
					<div>
						<span>0</span>
						<span>|</span>
					</div>


				</li>

				<li class="enter">
					<div>
						<span>0</span>
						<span>中/英</span>
					</div>

				</li>
				<li >
					<div>
						<span>2</span>
						<span>A</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>S</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>D</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>F</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>G</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>H</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>J</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>K</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>L</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>;</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>'</span>
					</div>
				</li>
				<li class="clear-margin enter">
					<div>
						<span>2</span>
						<span>return</span>
					</div>
				</li>

				<li class="shift">
					<div>
						<span>0</span>
						<span>shift</span>
					</div>
				</li>

				<li >
					<div>
						<span>2</span>
						<span>Z</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>X</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>C</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>V</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>B</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>N</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>M</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span><</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span> > </span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>/</span>
					</div>
				</li>
				<li class="clear-margin shift">
					<div>
						<span>0</span>
						<span>shift</span>
					</div>
				</li>

				<li >
					<div>
						<span>2</span>
						<span>fn</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>control</span>
					</div>
				</li>
				<li >
					<div>
						<span>0</span>
						<span>option</span>
					</div>
				</li>
				<li class="command">
					<div class="empty">
						<span>0</span>
						<span>command</span>
					</div>
				</li>
				<li class="space">
					<div class="empty">
						<span>0</span>
						<span>space</span>
					</div>
				</li>
				<li class="command">
					<div>
						<span>0</span>
						<span>command</span>
					</div>
				</li>
				<li >
					<div>
						<span>0</span>
						<span>option</span>
					</div>
				</li>

				<!--方向键-->

				<li>
					<div>
						<span>0</span>
						<span class="icon icon-left"></span>
					</div>
				</li>
				<ol  class="arrow">
					<li>
						<div class="arrow-up">
							<span class="icon icon-up"></span>
							<span>0</span>
						</div>
					</li>
					<li>
						<div class="arrow-down">
							<span class="icon icon-down"></span>
							<span>0</span>
						</div>
					</li>
				</ol>

				<li class="clear-margin">
					<div>
						<span>0</span>
						<span class="icon icon-right"></span>
					</div>
				</li>
			</ul>
			<ul class="keyboard keyboard-iso" style="display: none">
				<li class=" first-line esc">
					<div>
						<span>esc</span>
						<span>1</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F1</span>
						<span></span>
					</div>
				</li>
				<li class="first-line">
					<div>

						<span>F2</span>
						<span>2</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F3</span>
						<span> 3</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F3</span>
						<span> 4</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F5</span>
						<span> 5</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F6</span>
						<span> 6</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F7</span>
						<span>2</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F8</span>
						<span>1</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F9</span>
						<span>3</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F10</span>
						<span> 0</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F11</span>
						<span>11</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F12</span>
						<span> 12</span>
					</div>

				</li>
				<li class="clear-margin first-line ">
					<div>
						<span class="icon icon-on"></span>
						<span>12</span>
					</div>
				</li>


				<li >
					<div>
						<span>1</span>
						<span>。</span>
					</div>

				</li>
				<li >
					<div>
						<span>2</span>
						<span>1</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>2</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>3</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>4</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>5</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>6</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>7</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>8</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>9</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>0</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>、</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>_</span>
					</div>
				</li>
				<li class="clear-margin esc">
					<div>
						<span>0</span>
						<span>delete</span>
					</div>

				</li>

				<li class="esc">
					<div>
						<span>2</span>
						<span>tab</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>Q</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>W</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>E</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>R</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>T</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>Y</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>U</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>I</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>O</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>P</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>[</span>
					</div>
				</li>
				<li >
					<div>
						<span>0</span>
						<span>]</span>
					</div>

				</li>
				<li class="clear-margin return">
					<div>
						<span>0</span>
						<span>return</span>
					</div>


				</li>

				<li class="enter">
					<div>
						<span>0</span>
						<span>caps lock</span>
					</div>

				</li>
				<li >
					<div>
						<span>2</span>
						<span>A</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>S</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>D</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>F</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>G</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>H</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>J</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>K</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>L</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>;</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>'</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>\</span>
					</div>
				</li>

				<li class="shift1">
					<div>
						<span>0</span>
						<span>shift</span>
					</div>

				</li>
				<li >
					<div>
						<span>2</span>
						<span>~</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>Z</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>X</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>C</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>V</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>B</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>N</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>M</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span><</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>></span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>/</span>
					</div>
				</li>
				<li class="clear-margin shift2">
					<div>
						<span>0</span>
						<span>shift</span>
					</div>
				</li>

				<li >
					<div>
						<span>2</span>
						<span>fn</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>control</span>
					</div>
				</li>
				<li >
					<div>
						<span>0</span>
						<span>option</span>
					</div>

				</li>
				<li class="command">
					<div>
						<span>0</span>
						<span>command</span>
					</div>

				</li>
				<li class="space">
					<div>
						<span>0</span>
						<span>space</span>
					</div>

				</li>
				<li class="command">
					<div>
						<span>0</span>
						<span>command</span>
					</div>

				</li>
				<li >
					<div>
						<span>0</span>
						<span>option</span>
					</div>

				</li>

				<!--方向键-->


				<li>
					<div>
						<span>0</span>
						<span class="icon icon-left"></span>
					</div>


				</li>
				<ol class="arrow">
					<li class="arrow-up">
						<div>
							<span class="icon icon-up"></span>
							<span>0</span>
						</div>

					</li>
					<li class="arrow-down">
						<div>
							<span class="icon icon-down"></span>
							<span>0</span>
						</div>

					</li>

				</ol>

				<li class="clear-margin">
					<div>
						<span>0</span>
						<span class="icon icon-right"></span>
					</div>
				</li>
			</ul>
			<ul class="keyboard keyboard-jis" style="display: none">
				<li class=" first-line">
					<div>
						<span>esc</span>
						<span>1</span>
					</div>
				</li>
				<li class="first-line">
					<div>
						<span>F1</span>
						<span></span>
					</div>
				</li>
				<li class="first-line">
					<div>

						<span>F2</span>
						<span>2</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F3</span>
						<span> 3</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F3</span>
						<span> 4</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F5</span>
						<span> 5</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F6</span>
						<span> 6</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F7</span>
						<span>2</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F8</span>
						<span>1</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F9</span>
						<span>3</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F10</span>
						<span> 0</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F11</span>
						<span>11</span>
					</div>

				</li>
				<li class="first-line">
					<div>
						<span>F12</span>
						<span> 12</span>
					</div>

				</li>
				<li class="clear-margin first-line esc">
					<div>
						<span class="icon icon-on"></span>
						<span>12</span>
					</div>
				</li>


				<li class="esc">
					<div>
						<span>1</span>
						<span>1</span>
					</div>

				</li>
				<li >
					<div>
						<span>2</span>
						<span>2</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>3</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>4</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>5</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>6</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>7</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>8</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>9</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>0</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>=</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>~</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>￥</span>
					</div>
				</li>
				<li class="clear-margin ">
					<div>
						<span>0</span>
						<span>delete</span>
					</div>

				</li>

				<li >
					<div>
						<span>2</span>
						<span>tab</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>Q</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>W</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>E</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>R</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>T</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>Y</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>U</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>I</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>O</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>P</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>、</span>
					</div>
				</li>
				<li >
					<div>
						<span>0</span>
						<span>{</span>
					</div>

				</li>
				<li class="clear-margin return">
					<div>
						<span>0</span>
						<span>return</span>
					</div>


				</li>

				<li class="enter">
					<div>
						<span>0</span>
						<span>control</span>
					</div>

				</li>
				<li >
					<div>
						<span>2</span>
						<span>A</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>S</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>D</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>F</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>G</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>H</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>J</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>K</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>L</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>+</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>*</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>}</span>
					</div>
				</li>

				<li class="shift">
					<div>
						<span>0</span>
						<span>shift</span>
					</div>

				</li>
				<li >
					<div>
						<span>2</span>
						<span>Z</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>X</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>C</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>V</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>B</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>N</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>M</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span><</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>></span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>?</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>口</span>
					</div>
				</li>
				<li class="clear-margin shift">
					<div>
						<span>0</span>
						<span>shift</span>
					</div>
				</li>

				<li >
					<div>
						<span>2</span>
						<span>caps</span>
					</div>
				</li>
				<li >
					<div>
						<span>2</span>
						<span>option</span>
					</div>
				</li>
				<li class="command">
					<div>
						<span>0</span>
						<span>command</span>
					</div>

				</li>
				<li class="command">
					<div>
						<span>0</span>
						<span>英数</span>
					</div>

				</li>
				<li class="space">
					<div>
						<span>0</span>
						<span>space</span>
					</div>

				</li>
				<li class="command">
					<div>
						<span>0</span>
						<span>わわ</span>
					</div>

				</li>
				<li class="command">
					<div>
						<span>0</span>
						<span>conmad</span>
					</div>

				</li>
				<li >
					<div>
						<span>2</span>
						<span>fn</span>
					</div>
				</li>
				<!--方向键-->


				<li>
					<div>
						<span>0</span>
						<span class="icon icon-left"></span>
					</div>


				</li>
				<ol class="arrow">
					<li class="arrow-up">
						<div>
							<span class="icon icon-up"></span>
							<span>0</span>
						</div>

					</li>
					<li class="arrow-down">
						<div>
							<span class="icon icon-down"></span>
							<span>0</span>
						</div>

					</li>

				</ol>

				<li class="clear-margin">
					<div>
						<span>0</span>
						<span class="icon icon-right"></span>
					</div>


				</li>

			</ul>
		</section>
	</aside>
	<aside class="dialog dialog-confirm">
		<!--头部不需要可以去掉-->
		<header>
			<h3>我是标题</h3>
		</header>
		<section>
			确定揍这个家伙吗？
		</section>
		<footer>
			<button type="button" class="btn btn-cancel">取消</button>
			<button type="button" class="btn btn-ok">确定</button>
		</footer>
	</aside>
	<aside class="dialog dialog-config">
		<header>
			<h3>配置参数</h3>
		</header>
		<section>
			<div class="form-item">
				<label for="src">路径</label>
				<input id="src" type="text" name="" value="" placeholder="请输入路径"/>
			</div>
			<div class="form-item">
				<label for="sn">sn</label>
				<input id="sn" type="text" name="" value="" placeholder="请输入sn"/>
			</div>
			<div class="save-path">
				<span>保存路径</span>
				<p>D:\Documents\Visual Studio 2008\Templates\ProjectTemplates</p>
			</div>
		</section>
		<footer>
			<button type="button" class="btn btn-cancel">取消</button>
			<button type="button" class="btn btn-ok">保存</button>
		</footer>
	</aside>
	<script type="text/javascript">
		$(function(){
			//开启手动模式
			$(".keyboard-barcode .switch label").click(function(){
				var switchInput = document.getElementById("switch-input");
				if(!switchInput.checked){
					$(".keyboard-barcode .auto").hide();
					$(".keyboard-barcode .manual").show();
					$(".keyboard-barcode button").show();
					$(".keyboard-barcode select").show();
					$(".keyboard-barcode h2").hide();
				}else {
					$(".keyboard-barcode .manual").hide();
					$(".keyboard-barcode button").hide();
					$(".keyboard-barcode .auto").show();
					$(".keyboard-barcode select").hide();
					$(".keyboard-barcode h2").show();
				}
			});
			//显示、隐藏Tray盘弹窗
			$(".aside li").click(function(){
				$(".aside li").each(function(i, value){
					$(this).removeClass("active");
				});
				$(this).addClass("active");
				$(".mask").show();
				$(".dialog-tray-info").show();
			});
			$(".mask").click(function(){
				$(".mask").hide();
				$(".dialog-tray-info").hide();
			});
			$(".dialog-tray-info .icon.icon-close").click(function(){
				$(".mask").hide();
				$(".dialog-tray-info").hide();
			});
		});
	</script>
</body>
</html>